<template>
    <!--
    v-if 指令用于条件性地渲染一个元素。如果表达式返回 true，则该元素会被渲染；否则不会被渲染。
    v-show 指令用于根据条件显示或隐藏一个元素 ,
    v-show和v-if的区别在于 一个是隐藏dom标签 一个直接删除dom标签
    语法：
    v-if="变量名" v-show="变量名"
-->
    <div>
        <div v-show="isShow">
            <h3 v-if="age >= 18">我已成年可以进网咖了</h3>
            <h4 v-else-if="age>=17">我已进入法定年龄</h4>
            <p v-else>还没有成年回学校继续深造</p>
        </div>
    </div>

</template>

<script setup>
import {ref} from 'vue'
const age=ref(17)
const isShow=ref(true)


</script>

<style scoped>

</style>